<template>
<div>
  <div v-if="according">
    <van-swipe class="my-swipe" :autoplay="3000" indicator-color="white">
      <van-swipe-item v-for="(itemOne,index) in list" :key="index">
        <router-link :to="{path:'/detail',query:{categoryId:itemOne.articleId}}">
          <img :src="itemOne.coverImgUrl" alt="" style="width: 100%;height: 220px">
        </router-link>
      </van-swipe-item>
    </van-swipe>
  </div>
  <div>
    <van-swipe class="my-swipe" :autoplay="3000" indicator-color="white">
      <van-swipe-item v-for="(itemOne,index) in list" :key="index">
        <router-link :to="{path:'/detail',query:{categoryId:itemOne.articleId}}">
          <img :src="itemOne.coverImgUrl" alt="" style="width: 100%;height: 220px">
        </router-link>
        <p></p>
      </van-swipe-item>
    </van-swipe>
  </div>
</div>

</template>

<script>
import {swiper} from "@/api/http";
export default {
name: "swiper",
  created() {
    swiper(1,8).then(res=>{
    console.log(res)
    this.list = res.rows
   if (res.code == 0){
     this.according = false
   }
  })
  },
  data(){
  return {
    list:[],
    according:true
  }
  }
}
</script>

<style scoped lang="less">
.my-swipe .van-swipe-item {
  color: #fff;
  font-size: 20px;
  line-height: 150px;
  text-align: center;
  background-color: white;
  height: 220px;
}
.van-swipe__indicators {
  bottom: 0px;
}
</style>